import request from '../../request/index'
const state = {
    orderData: [], //总数据
    filterData:[],//筛选数据
    homeTopData: [],
    // 折线图数据
    options: {
        title: {
            text: "近10天订单趋势            折线图价钱总价除于100",
            left: "25px",
            top: "10px",
            textStyle: {
                color: "#333333",
                fontWeight: "normal",
                fontSize: 13,
                paddingLeft: "10px",
            },
        },
        tooltip: {
            trigger: "axis",
        },
        grid: {
            left: "3%",
            right: "4%",
            bottom: "3%",
            containLabel: true,
        },
        toolbox: {
            feature: {
                saveAsImage: {},
            },
        },
        xAxis: {
            type: "category",
            boundaryGap: true,
            data: [
                "11.1",
                "11.2",
                "11.3",
                "11.4",
                "11.5",
                "11.6",
                "11.7",
                "11.8",
                "11.9",
                "11.10",
            ],
        },
        yAxis: {
            type: "value",
        },

        series: [{
                name: "订单数",
                type: "line",
                itemStyle: {
                    color: "#ccc",
                    lineStyle: {
                        color: "#ccc",
                    },
                },
                symbol: "none", //取消小圆点显示
                data: [],
            },
            {
                name: "订单金额",
                type: "line",
                itemStyle: {
                    color: "#777",
                    lineStyle: {
                        color: "#777",
                    },
                },
                symbol: "none", //取消小圆点显示
                data: [],
            },
        ],
        legend: {
            data: ["订单数", "订单金额"],
            icon: "circle",
            top: 10,
            left: "45%",
            itemWidth: 7,
            itemHeight: 7,
            borderRadius: "50%",
            textStyle: {
                fontSize: 13,
                color: "#ccc",
                padding: [10, 10, 10, 10],
            },
        },
    },
    // 饼图数据
    btoptions: {
        title: {
            text: '订单占比',
            left: 'center',
            top: 50,
            textStyle: {
                fontWeight: "normal",
                fontSize: "14px"
            }
        },
        tooltip: {
            trigger: 'item'
        },
        legend: {
            orient: 'vertical',
            left: 20,
            top: 50,
        },
        color: ["#000000", "#333333", "#838383", "#b2b2b2", "#dcdcdc"],
        series: [{
            name: '订单占比',
            type: 'pie',
            radius: '50%',
            data: [],
            emphasis: {
                itemStyle: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)',
                    
                }
            },
            // 设置值域的标签
            label: {
                position: 'outer', // 设置标签位置，默认在饼状图外 可选值：'outer' ¦ 'inner（饼状图上）'
                // formatter: '{a} {b} : {c}个 ({d}%)'   设置标签显示内容 ，默认显示{b}
                // {a}指series.name  {b}指series.data的name
                // {c}指series.data的value  {d}%指这一部分占总数的百分比
                formatter: '{b}（{d}%）'
            }
        }]
    },
    // 订单统计
    orderTj:[]
}
const getters = {

}
const mutations = {
    // 获取订单数据
    setOrderData(state, res) {
        state.orderData = res
        // 首页头部数据
        state.homeTopData = [{
            id: "01",
            img: "/image/店铺资料.png",
            title: "待接单",
            orderStatus: "1",
            num: res.filter(item => {
                return item.orderStatus === "1"
            }),
        },
        {
            id: "02",
            img: "/image/自行车.png",
            title: "配送中",
            orderStatus: "2",
            num: res.filter(item => {
                return item.orderStatus === "2"
            }),
        },
        {
            id: "03",
            img: "/image/icon_comment.png",
            title: "待处理评价",
            orderStatus: "3",
            num: res.filter(item => {
                return item.orderStatus === "3"
            }),
        },
        {
            id: "04",
            img: "/image/支付_货币_英镑.png",
            title: "已退款",
            orderStatus: "4",
            num: res.filter(item => {
                return item.orderStatus === "4"
            }),
        },
        {
            id: "05",
            img: "/image/307感叹号.png",
            title: "缺货信息",
            orderStatus: "5",
            num: res.filter(item => {
                return item.orderStatus === "5"
            }),
        },
        ]
        // 订单统计
        state.orderTj = []
        state.orderTj.push({
            title:"成交金额（元）",
            num:state.orderData.filter(item => {
                if(item.orderStatus !== "4" && item.orderStatus !== "5"){
                    return item
                }
            }).map(item => {
                return item.ordermoney
            }).reduce((p,n) => {
                return Number(p) + Number(n)
            },0).toFixed(2)
        },{
            title:"成交订单数（单）",
            num:state.orderData.filter(item => {
                if(item.orderStatus !== "4" && item.orderStatus !== "5"){
                    return item
                }
            }).length
        },{
            title:"退款金额（元）",
            num:state.orderData.filter(item => {
                if(item.orderStatus === "4"){
                    return item
                }
            }).map(item => {
                return item.paymoney
            }).reduce((p,n) => {
                return Number(p) + Number(n)
            },0)
        },{
            title:"实际成交金额（元）",
            num:state.orderData.filter(item => {
                if(item.orderStatus !== "4" && item.orderStatus !== "5"){
                    return item
                }
            }).map(item => {
                return item.paymoney
            }).reduce((p,n) => {
                return Number(p) + Number(n)
            },0)
        })
    },
    // 筛选首页折线图数据
    filterZXTData(state,res){
        // 筛选首页折线表订单量数据
        let day1 = res.filter(item => {
            if(item.day === "1"){
                return item
            }
        })
        let day2 = res.filter(item => {
            if(item.day === "2"){
                return item
            }
        })
        let day3 = res.filter(item => {
            if(item.day === "3"){
                return item
            }
        })
        let day4 = res.filter(item => {
            if(item.day === "4"){
                return item
            }
        })
        let day5 = res.filter(item => {
            if(item.day === "5"){
                return item
            }
        })
        let day6 = res.filter(item => {
            if(item.day === "6"){
                return item
            }
        })
        let day7 = res.filter(item => {
            if(item.day === "7"){
                return item
            }
        })
        let day8 = res.filter(item => {
            if(item.day === "8"){
                return item
            }
        })
        let day9 = res.filter(item => {
            if(item.day === "9"){
                return item
            }
        })
        let day10 = res.filter(item => {
            if(item.day === "10"){
                return item
            }
        })
        state.options.series[0].data = []
        state.options.series[0].data.push(day1.length,day2.length,day3.length,day4.length,day5.length,day6.length,day7.length,day8.length,day9.length,day10.length)
        
        // 订单金额
        let orderM1 = res.filter(item => {
            if(item.day === "1"){
                return item
            }
        }).map(item => {
            return item.paymoney
        }).reduce((p,n) => {
            return Number(p) + Number(n)
        },0)
        let orderM2 = res.filter(item => {
            if(item.day === "2"){
                return item
            }
        }).map(item => {
            return item.paymoney
        }).reduce((p,n) => {
            return Number(p) + Number(n)
        },0)
        let orderM3 = res.filter(item => {
            if(item.day === "3"){
                return item
            }
        }).map(item => {
            return item.paymoney
        }).reduce((p,n) => {
            return Number(p) + Number(n)
        },0)
        let orderM4 = res.filter(item => {
            if(item.day === "4"){
                return item
            }
        }).map(item => {
            return item.paymoney
        }).reduce((p,n) => {
            return Number(p) + Number(n)
        },0)
        let orderM5 = res.filter(item => {
            if(item.day === "5"){
                return item
            }
        }).map(item => {
            return item.paymoney
        }).reduce((p,n) => {
            return Number(p) + Number(n)
        },0)
        let orderM6 = res.filter(item => {
            if(item.day === "6"){
                return item
            }
        }).map(item => {
            return item.paymoney
        }).reduce((p,n) => {
            return Number(p) + Number(n)
        },0)
        let orderM7 = res.filter(item => {
            if(item.day === "7"){
                return item
            }
        }).map(item => {
            return item.paymoney
        }).reduce((p,n) => {
            return Number(p) + Number(n)
        },0)
        let orderM8 = res.filter(item => {
            if(item.day === "8"){
                return item
            }
        }).map(item => {
            return item.paymoney
        }).reduce((p,n) => {
            return Number(p) + Number(n)
        },0)
        let orderM9 = res.filter(item => {
            if(item.day === "9"){
                return item
            }
        }).map(item => {
            return item.paymoney
        }).reduce((p,n) => {
            return Number(p) + Number(n)
        },0)
        let orderM10 = res.filter(item => {
            if(item.day === "10"){
                return item
            }
        }).map(item => {
            return item.paymoney
        }).reduce((p,n) => {
            return Number(p) + Number(n)
        },0)
        state.options.series[1].data = []
        state.options.series[1].data.push(orderM1/100,orderM2/100,orderM3/100,orderM4/100,orderM5/100,orderM6/100,orderM7/100,orderM8/100,orderM9/100,orderM10/100)
    },
    // 筛选饼图数据
    filterBtData(state,res){
        // 筛选首页饼图数据
        let arr1 = res.filter(item => {
            if(item.orderNProportion === "1"){
                return item
            }
        })
        let arr2 = res.filter(item => {
            if(item.orderNProportion === "2"){
                return item
            }
        })
        let arr3 = res.filter(item => {
            if(item.orderNProportion === "3"){
                return item
            }
        })
        let arr4 = res.filter(item => {
            if(item.orderNProportion === "4"){
                return item
            }
        })
        let arr5 = res.filter(item => {
            if(item.orderNProportion === "5"){
                return item
            }
        })
        state.btoptions.series[0].data=[{
            value:arr1.length,
            name:"套餐"
        },{
            value:arr2.length,
            name:"主食"
        },{
            value:arr3.length,
            name:"饮料"
        },{
            value:arr4.length,
            name:"小吃"
        },{
            value:arr5.length,
            name:"甜点"
        }]
    },
}
const actions = {
    // 获取订单数据
    async getOrderData(context) {
        await request({
            url: "/getOrderList",
            method: "GET",
            params: {},
        }).then(res => {
            context.commit('setOrderData', res.data)
        })
    }
}
export default {
    namespaced: true,
    state,
    getters,
    mutations,
    actions
}